﻿<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<!DOCTYPE html>
<html>
<head runat="server">
    <meta name="viewport" content="width=device-width" />
    <title></title>

    <style>
        .pictureclass {
            width: 200px;
            height: 260px;
        }

        .showname {
            height: 30px;
            color: blue;
            text-align: center;
        }

        .showtype {
            text-align: center;
            color: red;
            font-size: 60px;
            height: 100px;
        }

        .auto-style1 {
            width: 401px;
            height: 102px;
        }
    </style>
    <script src="../../Scripts/jquery.min.js"></script>
    <script>
        var count = 0;
        function setloadingcontent(html, title) {
            alert(html);
            alert(title);
            count++;
        }
        $(function () {
            $.ajax({
                async: false,
                cache: false,
                url: "../Loading/GetLoadingContent",
                dataType: "json",

                success: function (msg) {

                    //if (msg != "")  //表示已经登录
                    //{
                    var length = msg.length;
                    var html = msg[count % length].Html;
                    var title = msg[count % length].Title;
                    $('#tdemo1').html(html);
                    $('#showtype').html(title);

                    $('#tdemo2').html("");
                    count++;
                    var IsMarquee = $('#picturemarquee').val();
                    if ("1" == IsMarquee) {


                        var speed = 30;
                        var demo = getElement("tdemo");
                        var demo2 = getElement("tdemo2");
                        var demo1 = getElement("tdemo1");
                        demo2.innerHTML = demo1.innerHTML; //复制demo1中的图片到demo2中

                        function Marqueeright() {//向右滚动
                            if (demo.scrollLeft <= 0) {
                                demo.scrollLeft += demo2.offsetWidth;
                            }
                            else {
                                demo.scrollLeft--;
                            }
                        }
                        if (count <= length) {
                            var MyMar = setInterval(Marqueeright, speed); //自动开始滚动
                        }

                        demo.onmouseover = function () { clearInterval(MyMar) };
                        demo.onmouseout = function () { MyMar = setInterval(Marqueeright, speed); };
                    }
                    // window.setInterval("setloadingcontent('" + msg[count % length].Html + "','" + msg[count % length].Title + "')", 3000);
                    window.setInterval(function () {
                        var html = msg[count % length].Html;
                        var title = msg[count % length].Title;
                        $('#tdemo1').html(html);
                        $('#showtype').html(title);
                        
                        $('#tdemo2').html("");
                        count++;
                        var IsMarquee = $('#picturemarquee').val();
                        if ("1" == IsMarquee) {
                            
                             
                            var speed = 30;
                            var demo = getElement("tdemo");
                            var demo2 = getElement("tdemo2");
                            var demo1 = getElement("tdemo1");
                            demo2.innerHTML = demo1.innerHTML; //复制demo1中的图片到demo2中

                            function Marqueeright() {//向右滚动
                                if (demo.scrollLeft <= 0) {
                                    demo.scrollLeft += demo2.offsetWidth;
                                }
                                else {
                                    demo.scrollLeft--;
                                }
                            }
                            if (count <= length) {
                                var MyMar = setInterval(Marqueeright, speed); //自动开始滚动
                            }
                            
                            demo.onmouseover = function () { clearInterval(MyMar) };
                            demo.onmouseout = function () { MyMar = setInterval(Marqueeright, speed); };
                        }



                    }, 30000);

                }
            });

            //$.ajax({
            //    async: false,
            //    cache: false,
            //    url: "../Loading/GetLoadingPicture",
            //    dataType: "text",

            //    success: function (msg) {
            //        if (msg != "")  //表示已经登录
            //        {

            //            $('#tdemo1').html(msg);
            //        }

            //    }
            //});

            //$.ajax({
            //    async: false,
            //    cache: false,
            //    url: "../Loading/GetLoadingType",
            //    dataType: "text",

            //    success: function (msg) {
            //        if (msg != "")  //表示已经登录
            //        {

            //            $('#showtype').html(msg);
            //        }

            //    }
            //});


            //var IsMarquee = $('#picturemarquee').val();
            //if ("1" == IsMarquee) {
            //    window.onload = function () {
            //        function getElement(id) {
            //            return document.getElementById(id);
            //        }
            //        var speed = 30;
            //        var demo = getElement("tdemo");
            //        var demo2 = getElement("tdemo2");
            //        var demo1 = getElement("tdemo1");
            //        demo2.innerHTML = demo1.innerHTML; //复制demo1中的图片到demo2中

            //        function Marqueeright() {//向右滚动
            //            if (demo.scrollLeft <= 0) {
            //                demo.scrollLeft += demo2.offsetWidth;
            //            }
            //            else {
            //                demo.scrollLeft--;
            //            }
            //        }

            //        function Marqueeleft() {//向左滚动
            //            if (demo2.offsetWidth - demo.scrollLeft <= 0)
            //                demo.scrollLeft -= demo1.offsetWidth;
            //            else
            //                demo.scrollLeft++;
            //        }
            //        var MyMar = setInterval(Marqueeright, speed); //自动开始滚动

            //        demo.onmouseover = function () { clearInterval(MyMar) };
            //        demo.onmouseout = function () { MyMar = setInterval(Marqueeright, speed); };
            //    }
            //}



        });

        function GoToIndex() {
            window.location.href = "../Index.html";
        }
        function getElement(id) {
            return document.getElementById(id);
        }
    </script>


</head>
<body style="background: url(../../Images/bg.jpg)">
    <table cellpadding="0" cellspacing="0" style="width: 1910px; height: 1060px" align="center">
        <tr style="height: 400px">
            <td></td>
        </tr>
        <tr class="showtype">
            <td id="showtype"></td>

        </tr>
        <tr>
            <td>
                <div id="tdemo" align="center" style="overflow: hidden; width: 1800px; margin: 0 auto; color: #ffffff">
                    <table cellpadding="0" cellspacing="0" border="0">
                        <tr>
                            <td id="tdemo1" valign="middle"></td>
                            <td id="tdemo2" style="clear: right; float: left" valign="middle"></td>
                        </tr>
                    </table>
                </div>
            </td>
        </tr>
        <tr>
            <td style="text-align: right">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            </td>
        </tr>
    </table>
    <input type="image" src="../../Images/back.jpg" style="position: absolute; top: 902px; left: 1742px" onclick="javascript: window.history.go(-1)" />
</body>
</html>
